<template>
  <view class="home">
    <!-- 头部 start -->
    <uni-nav-bar
      fixed="true"
      statusBar="true"
      leftBtnShow="true"
      backgroundImage="linear-gradient(#3388FF, #6197f8)"
      :border="false"
      leftIcon="back"
      color="#fff"
      @clickLeft="clickLeft"
    >
       <view class="uni-title">{{title}}</view>
    </uni-nav-bar>
    <!-- 头部 end -->
    <!-- 内容 start -->
    <view>
      <mescroll-item ref="mescrollItem" :chooseFlag="chooseFlag" :prescriptionId="prescriptionId" :hospId="hospId" :hospTotalPrice="hospTotalPrice" :addressJson="addressJson" :orderId="orderId" :orderFlag="orderFlag" :drugsList="drugsList" :action="action"></mescroll-item>
    </view>
    <!-- 头部信息 start -->
    <!-- 头部信息 end -->
    <view class="btn-bottom">
      <Button size="large" type="primary" @click="toNewAddress">新增收货地址</Button>
    </view>

  </view>
</template>

<script>
import hccmStore from "@/common/hccm-store.js"
import MescrollItem from "./mescroll-comp-item.vue"; // 一个mescroll-body写在子组件的情况
import MescrollCompMixin from "@/uni_modules/mescroll-uni/components/mescroll-uni/mixins/mescroll-comp.js";
export default {
  mixins: [MescrollCompMixin],
  components: {
    MescrollItem
  },
  data() {
    return {
      offsetTop: hccmStore.getOffsetTop(), //安全高度
      offsetHeight:  hccmStore.getOffsetHeight(), //安全高度
      title: '收货地址',
      chooseFlag: false,
      addressJson: '',
      prescriptionId:'',
      hospTotalPrice:'',
      orderId:'',
      orderFlag: false,
      hospId:'',
      drugsList:'',
      action:'',
    }
  },
  onLoad(options) {
    console.log('options.addressJson22222222',options)
    this.chooseFlag = options.chooseFlag || false
    this.addressJson = options.addressJson
    this.prescriptionId = options.prescriptionId
    this.hospTotalPrice = options.hospTotalPrice 
    this.orderId = options.orderId 
    this.orderFlag = options.orderFlag 
    this.drugsList = options.drugsList 
    this.action = options.action 
    this.hospId = options.hospId
  },
  onShow() {
  },
  methods:{
    // 返回
    clickLeft() {
      uni.navigateBack()
    },
    // 新增收货地址
    toNewAddress(){
      uni.navigateTo({
        url: `/pages/address/edit-address?addressJson=${this.addressJson}&chooseFlag=${this.chooseFlag}&prescriptionId=${this.prescriptionId}&hospTotalPrice=${this.hospTotalPrice}&hospId=${this.hospId}&orderId=${this.orderId}&orderFlag=${this.orderFlag}&drugsList=${this.drugsList}&action=${this.action}`,
        success: res => {},
        fail: () => {},
        complete: () => {},
      })
    },
  }
}
</script>

<style lang="scss">
@import "@/static/css/index.scss";
// begin
.home {
  height: 100%;
  overflow: hidden;
  .content{
    box-sizing: border-box;
    overflow: auto;
    padding-bottom: 220rpx;
    background-image: linear-gradient(#6197f8, #f5f5f5, #f5f5f5);
    .address-box{
      position: relative;
      padding: 28rpx;
      border-radius: 20rpx;
      background: #fff;
      margin: 30rpx;
      .des{
        padding: 30rpx 20rpx 20rpx;
        flex:1;
        align-items: flex-start;
        flex-direction: column;
        .largeAddress{
          font-size: 24rpx;
          justify-content: flex-start;
          align-items: end;
          .choose-box{
            background: #3388FF;
            color: #fff;
            height: 30rpx;
            line-height: 30rpx;
            font-size: 20rpx;
            padding: 2rpx 10rpx;
            margin-right: 10rpx;
            border-radius: 4rpx;
          }
        }
        .desAddress{
          padding: 12rpx 0;
          font-size: 30rpx;
          font-weight: 600;
        }
        .persion-des{
          justify-content: flex-start;
          color: #666666;
          font-size: 24rpx;
          .name{
            padding-right: 20rpx;
          }
        }
      }
      .status-box{
        width: 60rpx;
        .iconfont{
          font-size: 50rpx;
          color: #DDDDDD;
        }
        .icon-xuanzhong{
          color: #3388FF;
        }
      }
      .edit{
        position: absolute;
        right: 0;
        top: 0;
        padding: 40rpx;
        .iconfont{
          font-size: 40rpx;
          color: #666;

        }
      }
    }
  }
  .btn-bottom{
    z-index: 10000;
  }
}
</style>
